<template>
	<view class="container">
		<TopNav title="注销账号"></TopNav>
		<view class="">
			<text class="f-s14 text-gray line-height24 f-w400 m-t7">为保证你的账号安全，在你提交的注销申请生效前，需同时满足以下条件:</text>
		</view>
		<view class="flex flex-direction m-t10">
			<text class="f-s15 f-w500 line-height24">1、账号财产已清算</text>
			<text class="f-s14 text-gray line-height20 f-w400 m-t7">没有资产，未结清的资产和虚拟权益，本账号及通过本账号接入第三方中没有未完成或存在争议的服务</text>
		</view>
		<view class="flex flex-direction m-t25">
			<text class="f-s15 f-w500 line-height24">2、账号权限解除</text>
			<text class="f-s14 text-gray line-height20 f-w400 m-t7">账号已解除与其它产品的授权登录或绑定关系</text>
		</view>
		<view class="flex flex-direction m-t25">
			<text class="f-s15 f-w500 line-height24">3、账号无任何纠纷，包括投诉举报</text>
		</view>
		<view class="flex flex-direction m-t30">
			<text class="f-s15 f-w500 line-height24 text-theme">提示：账号注销不是退出登录，注销后将清空所有数据且不可恢复</text>
		</view>
		<view class="fixed-bottom p-lr16">
			<view class="flex align-items-baseline tips">
				<u-radio-group v-model="checked">
					<u-radio activeColor="#FE3F59" shape="square" labelDisabled :name="true" size="32rpx"></u-radio>
				</u-radio-group>
				<view class="f-s12">
					我已阅读并同意<text class="text-theme" @click="handleToPage('/pages/common/document/index?title=搭搭陪伴注销协议')">《搭搭陪伴注销协议》</text>
				</view>
			</view>
			<view class="self-btn flex flex-direction full-width" hover-class="pressed" @click="handleSubmit">
				<text class="f-s16 line-height22">确认注销</text>
			</view>
		</view>
		<Toast></Toast>
		<Modal :show.sync="modalShow" title="提示" content="您正在注销账号!\n注销后数据将不可恢复" @confirm="handleModalConfirm">
		</Modal>
	</view>
</template>

<script>
	import {
		signout,
		signoutCheck
	} from "@/api/login.js"
	import Modal from '@/components/modal'
	export default {
		components: {
			Modal
		},
		data() {
			return {
				checked: false,
				modalShow: false
			};
		},
		onLoad() {},
		methods: {
			handleToPage(path){
				this.$tab.navigateTo(path)
			},
			handleModalConfirm() {
				this.$modal.loading("正在校验账户状态").then(() => {
					signoutCheck().then(() => {
						this.$modal.loading("正在注销");
						signout().then((res) => {
							this.$modal.closeLoading()
							this.$toast(res.msg).then(() => {
								uni.reLaunch({
									url: '/pages/login/index'
								})
							})
						}).catch(() => this.$modal.closeLoading())
					}).catch(() => this.$modal.closeLoading())
				})
			},
			handleSubmit() {
				if (!this.checked) {
					this.$toast("请阅读并同意《搭搭陪伴注销协议》")
					return
				}
				this.modalShow = true
			}

		}
	}
</script>

<style lang="scss">
	@import '@/common/css/var.scss';

	page {
		background-color: #fff;
		@include fixed-bottom(50rpx);
	}
</style>
<style lang="scss" scoped>
	.container {
		padding: 20rpx 32rpx;

		.m-t7 {
			margin-top: 14rpx;
		}

		.tips {
			width: 100%;
			padding: 20rpx 24rpx;
			background: #FEEBEE;
			width: 100%;
			position: absolute;
			bottom: 100%;
			left: 0;
		}

		::v-deep .u-radio-group {
			flex: none;
		}
	}
</style>